<template>
  <wd-navbar 
    title="知识库详情" 
    custom-class="navbar-custom" 
    :bordered="false" 
    safeAreaInsetTop
    left-arrow
    @click-left="goBack"
  ></wd-navbar>
  <view class="px-[22rpx] pt-[24rpx] pb-[24rpx]">
    <mp-html
      :content="htmlContent"
      :tag-style="{
        div: 'white-space: pre-wrap;',
        span: 'white-space: pre-wrap;',
        p: 'white-space: pre-wrap;',
        img: 'margin: 5px 0;width:100%;max-width: 100%;',
      }"
    />
  </view>
</template>

<script setup>
import mpHtml from 'mp-html/dist/uni-app/components/mp-html/mp-html'
definePage({
  style: {
    navigationStyle: 'custom',
    navigationBarTitleText: '知识库详情',
  },
})
defineOptions({
  name: 'KnowStoreDetail',
})

const htmlContent = ref('')

onLoad((options) => {
  htmlContent.value = "<p><strong><em>测试测试测</em><u><img src=\"https://jinjukeji.oss-cn-hangzhou.aliyuncs.com/cardoctor1760354484843.jpg\">试测试测试测试测试</u></strong></p>"
})

// 返回上一页
const goBack = () => {
  uni.navigateBack()
}

</script>

<style>
page {
  background-color: #F1F1F1;
}
</style>

<style lang="scss" scoped>
//
</style>
